﻿@using CJAtech.BBS.DataEntity;
@{
    Layout = null;
    string attachUrls = "userId=" + Request["UserId"] + "&userName=" + Request["UserName"] + "&avatar" + Request["Avatar"];
}
@model CategoryInfo

<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" />
    <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
    <meta name="format-detection" content="telephone=no,email=no" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="renderer" content="webkit" />
    <title>互动论坛</title>
    <link type="text/css" rel="stylesheet" href="/Content/CJCourse/pkg/base.css">
    <link type="text/css" rel="stylesheet" href="/Content/CJCourse/pkg/combine.css">
    <link type="text/css" rel="stylesheet" href="/Content/CJCourse/plugins/modal/modal.css">
    <link type="text/css" rel="stylesheet" href="/Content/CJCourse/css/layout.css">
</head>
<body>
    <div id="wrapper">
        <div class="container nptb">
            <div class="header text-right">
                <h5 class="float-left">品牌故事</h5>
                <a href="/cjcourse/publish?categoryId=@Model.CategoryId&@attachUrls" class="publish">
                    <i class="icomoon icon-plus"></i>
                    <span class="middle">发布话题</span>
                </a>
            </div>
            <ul id="articlelist" class="topic-list list link nplr">
            </ul>
            <div id="loadingText" class="text-center padding-10">正在加载...</div>
        </div>
    </div>
    <script type="text/javascript" charset="utf-8" src="/Content/CJCourse/js/zepto/zepto.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="/Content/CJCourse/js/zepto/selector.js"></script>
    <script type="text/javascript" charset="utf-8" src="/Content/CJCourse/js/zepto/compatibleIE9.js"></script>
    <!--<script src="js/animation/tween.js"></script>-->
    <script type="text/javascript" charset="utf-8" src="/Content/CJCourse/js/fastclick/fastclick.js"></script>
    <script type="text/javascript" charset="utf-8" src="/Content/CJCourse/plugins/modal/modal.js"></script>
    <script type="text/javascript" charset="utf-8" src="/Content/CJCourse/js/global.js"></script>
    <script src="/Content/js/common/Bigger.js"></script>
    <script src="/Content/js/scroll/scrollpagination.js"></script>
    <script type="text/javascript">
    var pageIndex = 1;
    BindArticles(10);
    function BindArticles(pageSize) {
        pageSize = pageSize || 10;
        $("#articlelist").scrollPagination({
            //contentPage: "/cjcourse/getarticlelist?categoryId=8&pageIndex=" + pageIndex + "&pageSize=" + pageSize,
            contentData: {},
            scrollTarget: $(window),
            heightOffset: 10,
            beforeLoad: function (options) {
                $("#loadingText").show();
                options.contentPage = "/cjcourse/getarticlelist?categoryId=@Model.CategoryId&pageIndex=" + pageIndex + "&pageSize=" + pageSize + "@attachUrls";
            },
            appendItems: function (objInvokeResult) {
                $("#loadingText").hide();

                if (objInvokeResult.ResultCode == "ArticleInfoNull") {
                    //todo：移除更多事件
                    $("#article_more").removeAttr("onclick");
                    $("#article_more").hide();
                    //停止滚动加载
                    $("#articlelist").stopScrollPagination();
                    return;
                }
                if (objInvokeResult.ResultCode != "Success") {
                    alert(objInvokeResult.ResultMessage);
                    return;
                }
                if (objInvokeResult.Data.length < pageSize) {
                    //停止滚动加载
                    $("#articlelist").stopScrollPagination();
                    $("#article_more").removeAttr("onclick");
                    $("#article_more").hide();
                } else {
                    //$("#article_more").show();
                }
                var html = "";
                $.each(objInvokeResult.Data, function (i, objArticleResultInfo) {
                    html += CreateArticleHtml(objArticleResultInfo);
                });

                $("#articlelist").append(html);

                pageIndex++;
            },
            afterLoad: function (objInvokeResult) {

            }
        });
    }

    function CreateArticleHtml(objArticleResultInfo) {
        var html = "";
        if (typeof (objArticleResultInfo) == "undefined" || typeof (objArticleResultInfo.ArticleInfo) == "undefined") {
            return html;
        }
        var objArticleInfo = objArticleResultInfo.ArticleInfo;
        html =
            '<li>' +
                '<a href="/cjcourse/article/thread-topic/' + objArticleInfo.ArticleId + '?@attachUrls">' +
                    '<div class="title">' + objArticleInfo.ArticleTitle + '</div>' +
                    '<div class="info">' +
                        '<div class="time">' + convertUnixTime(objArticleInfo.CreateDate, "yyyy-MM-dd") + '</div>' +
                        '<div class="statistics">' +
                            '<i class="icomoon ' + (objArticleInfo.IsDigg ? 'icon-praised' : 'icon-praise') + ' color"></i>' +
                            '<span>' + objArticleInfo.DiggCount + '</span>' +
                            '<i class="icomoon icon-eye"></i>' +
                            '<span>' + objArticleInfo.ViewCount + '</span>' +
                            '<i class="icomoon icon-comment"></i>' +
                            '<span>' + objArticleInfo.CommentCount + '</span>' +
                        '</div>' +
                    '</div>' +
                '</a>' +
            '</li>';
        return html;
    }
    </script>
</body>
</html>